<!DOCTYPE html>
<html>
  <!--
  Copyright (c) 2012 The Chromium Authors. All rights reserved.
  Use of this source code is governed by a BSD-style license that can be
  found in the LICENSE file.
  -->
<head>
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Expires" content="-1">
  <title>{{title}}</title>
  <script type="text/javascript" src="common.js"></script>
  <script type="text/javascript" src="example.js"></script>
</head>
<body data-width="200" data-height="200" data-custom-load="true" {{attrs}}>
  <h1>{{title}}</h1>
  <h2>Status: <code id="statusField">NO-STATUS</code></h2>
  <p>The File IO example demonstrates saving, loading, and deleting files
     from the persistent file store.</p>

  <div>
    <span>
      <input type="radio" id="radio_saveFile" name="group" checked="checked">
        Save File
      <input type="radio" id="radio_loadFile" name="group">Load File
      <input type="radio" id="radio_delete" name="group">Delete File/Directory
      <input type="radio" id="radio_listDir" name="group">List Directory
      <input type="radio" id="radio_makeDir" name="group">Make Directory
      <input type="radio" id="radio_rename" name="group">Rename
    </span>
  </div>
  <div class="function" id="saveFile">
    <div>
      <span>
        Filename:
        <input type="text" value="/filename.txt">
        <button>Save</button>
      </span>
    </div>
    <textarea id="saveFileEditor" cols="40" rows="10" wrap="hard"
      placeholder="Enter some text to save in a file..."></textarea>
  </div>
  <div class="function" id="loadFile" hidden>
    <div>
      <span>
        Filename:
        <input type="text" value="/filename.txt">
        <button>Load</button>
      </span>
    </div>
    <textarea cols="40" rows="10" wrap="hard"></textarea>
  </div>
  <div class="function" id="delete" hidden>
    <span>
      Filename/Directory:
      <input type="text" value="/filename.txt">
      <button>Delete</button>
    </span>
  </div>
  <div class="function" id="listDir" hidden>
    <div>
      <span>
        Directory:
        <input type="text" value="/">
        <button>List Directory</button>
      </span>
    </div>
    Result:
    <ul id="listDirOutput">
    </ul>
  </div>
  <div class="function" id="makeDir" hidden>
    <span>
      Directory:
      <input type="text" value="/directory">
      <button>Make Directory</button>
    </span>
  </div>
  <div class="function" id="rename" hidden>
    <div>
      Old name:
      <input id="renameOld" type="text" value="/filename.txt">
    </div>
    <div>
      New name:
      <input id="renameNew" type="text" value="/filename2.txt">
    </div>
    <button>Rename</button>
  </div>

  <pre id="log" style="font-weight: bold"></pre>
  <!-- The NaCl plugin will be embedded inside the element with id "listener".
      See common.js.-->
  <div id="listener"></div>
</body>
</html>
